<div class="easyui-panel" data-options="fit:true, border:false" style="padding:10px;">
    <div class="easyui-layout" data-options="fit:true">
        <div data-options="region:'west',split:true, collapsible:false" title="系统菜单" style="width:250px;">
            <ul id="menu_tree" data-options="animate:true,fit:true"></ul>
        </div>
        <div data-options="region:'center', border:false">
            <div id="menu_tabs" class="easyui-tabs" data-options="fit:true,border:true">
                <div title="添加" class="content-layout">
                    <form id="menu_add_panel" data-url="{:U('menu/save')}" method="post" class="form-panel">
                        <table>
                            <tr>
                                <th width="80">菜单名称：</th>
                                <td><input type="text" name="menu_name" size="25" class="easyui-validatebox input-text" data-options="required:true"></td>
                            </tr>
                            <tr>
                                <th>操作类名：</th>
                                <td>
                                    <input type="text" name="class_name" size="25" class="easyui-validatebox input-text" data-options="required:true">
                                    <span class="tips">建立的控制器名称，小写字母，如：控制器类名是MenuAction，则填写menu</span>
                                </td>
                            </tr>
                            <tr>
                                <th>执行函数：</th>
                                <td>
                                    <input type="text" name="method_name" class="input-text" size="25">
                                    <span class="tips">如需要执行类MenuAction中的tree_list方法，则填写tree_list</span>
                                </td>
                            </tr>
                            <tr>
                                <th>上级菜单：</th>
                                <td>
                                    <input class="easyui-combotree input-text" name="parent_id" value="0" method="get" data-options="url:'{:U('menu/tree?select=1')}'" style="width:200px;">
                                </td>
                            </tr>
                            <tr>
                                <th>是否显示：</th>
                                <td>
                                    <input type="radio" value="1" name="displayed" checked> 是
                                    <input type="radio" value="0" name="displayed"> 否
                                </td>
                            </tr>
                            <tr>
                                <th>排列顺序：</th>
                                <td>
                                    <input type="text" name="order_by" class="easyui-numberspinner" data-options="min:0,max:1000,required:true" value="50">
                                    <span class="tips">数据越大,越排在前</span>
                                </td>
                            </tr>
                            <tr>
                                <th>菜单参数：</th>
                                <td>
                                    <input type="text" name="query_string" size="45" class="input-text">
                                    <span class="tips">样例：参数1=参数值1&参数2=参数值2......</span>
                                </td>
                            </tr>
                            <tr>
                                <th>菜单描述：</th>
                                <td>
                                    <textarea name="remark" rows="3" cols="55" class="input-text"></textarea>
                                </td>
                            </tr>
                            <tr>
                                <th height="20"></th>
                                <td>&nbsp;</td>
                            </tr>
                            <tr>
                                <th></th>
                                <td>
                                    <a href="javascript:;" class="easyui-linkbutton" data-options="iconCls:'icon-save'" onclick="menu_save(this)">保存</a>
                                </td>
                            </tr>
                        </table>
                    </form>
                </div>
                <div title="编辑" class="content-layout">
                    <form id="menu_edit_panel" data-url="{:U('menu/save')}" method="post" class="form-panel">
                        <table>
                            <tr>
                                <th width="80">菜单名称：</th>
                                <td><input type="text" name="menu_name" size="25" class="easyui-validatebox input-text" data-options="required:true"></td>
                            </tr>
                            <tr>
                                <th>操作类名：</th>
                                <td>
                                    <input type="text" name="class_name" size="25" class="easyui-validatebox input-text" data-options="required:true">
                                    <span class="tips">建立的控制器名称，小写字母，如：控制器类名是MenuAction，则填写menu</span>
                                </td>
                            </tr>
                            <tr>
                                <th>执行函数：</th>
                                <td>
                                    <input type="text" name="method_name" class="input-text" size="25">
                                    <span class="tips">如需要执行类MenuAction中的tree_list方法，则填写tree_list</span>
                                </td>
                            </tr>
                            <tr>
                                <th>上级菜单：</th>
                                <td>
                                    <input class="easyui-combotree input-text" name="parent_id" value="0" method="get" data-options="url:'{:U('menu/tree?select=1')}'" style="width:200px;">
                                </td>
                            </tr>
                            <tr>
                                <th>是否显示：</th>
                                <td>
                                    <input type="radio" value="1" name="displayed"> 是
                                    <input type="radio" value="0" name="displayed"> 否
                                </td>
                            </tr>
                            <tr>
                                <th>排列顺序：</th>
                                <td>
                                    <input type="text" name="order_by" class="easyui-numberspinner" data-options="min:0,max:1000,required:true" value="50">
                                    <span class="tips">数据越大,越排在前</span>
                                </td>
                            </tr>
                            <tr>
                                <th>菜单参数：</th>
                                <td>
                                    <input type="text" name="query_string" size="45" class="input-text">
                                    <span class="tips">样例：参数1=参数值1&参数2=参数值2......</span>
                                </td>
                            </tr>
                            <tr>
                                <th>菜单描述：</th>
                                <td>
                                    <textarea name="remark" rows="3" cols="55" class="input-text"></textarea>
                                </td>
                            </tr>
                            <tr>
                                <th height="20"></th>
                                <td>&nbsp;</td>
                            </tr>
                            <tr>
                                <th></th>
                                <td>
                                    <input type="hidden" id="menu_id" name="menu_id" value="0">
                                    <a href="javascript:;" class="easyui-linkbutton" data-options="iconCls:'icon-save'" onclick="menu_save(this)">保存</a>
                                    <a href="javascript:;" class="easyui-linkbutton" data-options="iconCls:'icon-remove'" onclick="menu_drop($('#menu_id').val())">删除</a>
                                </td>
                            </tr>
                        </table>
                    </form>
                </div>
            </div>
        </div>
    </div>
</div>
<script type="text/javascript">
    var menu_data = [];
    $('#menu_tree').tree({
        url: "{:U('menu/tree')}",
        onClick: function(node){
            if(!menu_data[node.id]){
                $.getJSON("{:U('menu/item')}", {itemid: node.id}, function(data){
                    menu_data[node.id] = data;
                });
            }
            $('#menu_edit_panel').form('load', menu_data[node.id]);	// load from URL
            $('#menu_tabs').tabs('select', 1);
        }
    });

    function menu_back(result)
    {
        if(result.success){
            reflashTab(top.$('#rightTabs'));
        }else{
            easyui.alert(result.message);
        }
    }

    function menu_save(element){
        disable(element);
        var form = $(element).parents('form');
        easyui.submit(form, menu_back);
        enable(element);
    }

    function menu_drop(item_id){
        if(!item_id) return false;
        easyui.AjaxCall("{:U('menu/drop')}", {itemid: item_id}, menu_back);
    }
</script>